import { Col, Row } from 'antd';
import { useSearchParams } from 'react-router-dom';
import { DriveBeSecPer } from '../../components/DriveBeSecPer';
import DriverAlarmTrend from '../../components/DriverAlarmTrend';
import DriverSafeIndexTrend from '../../components/DriverSafeIndexTrend';
import { PeerComparison } from '../../components/PeerComparison';
import SafeIndexRadarChart from '../../components/SafeIndexRadarChart';
export type DPanelProps = {
  driverId: string;
  entId?: string;
};
const DriverIndexPanel: React.FC<DPanelProps> = ({ ...props }) => {
  const [searchParams] = useSearchParams();

  const driverName = searchParams.get('driverName') || '';

  return (
    <div>
      <Row gutter={[16, 16]}>
        <Col span={12}>
          {/* 单司机安全指数雷达图 */}
          <SafeIndexRadarChart type="driver" title={`${driverName}的安全指数`} />
        </Col>
        <Col span={12}>
          {/*司机安全指数趋势图...*/}
          <DriverSafeIndexTrend {...props}></DriverSafeIndexTrend>
        </Col>
        <Col span={12}>
          {/*驾驶行为二级占比...*/}
          <DriveBeSecPer {...props}></DriveBeSecPer>
        </Col>
        <Col span={12}>
          {/*司机报警趋势图...*/}
          <DriverAlarmTrend {...props}></DriverAlarmTrend>
        </Col>
        <Col span={24}>
          {/*同行比较...*/}
          <PeerComparison {...props}></PeerComparison>
        </Col>
      </Row>
    </div>
  );
};
export default DriverIndexPanel;
